import React from 'react';
import PropTypes from "prop-types";
function TodoMain(props) {
    return (
        <ul className="todo-main">
            {
                props.taskList.map(item=>(
                    <li key={item.id}>
                        <label>
                            {/*<input onChange={()=>props.changeIsChecked(item.id)} checked={item.isChecked} type="checkbox"/>*/}
                            <input onChange={props.changeIsChecked.bind(null,item.id)} checked={item.isChecked} type="checkbox"/>
                            <span>{item.title}</span>
                        </label>
                        <button onClick={props.delTaskById.bind(null,item.id)} className="btn btn-danger" >删除</button>
                    </li>
                ))
            }

        </ul>
    );
}
TodoMain.propTypes = {
    taskList:PropTypes.array.isRequired,
    changeIsChecked:PropTypes.func.isRequired,
    delTaskById:PropTypes.func.isRequired,
}

export default TodoMain;